<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>iconfont Demo</title>
  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
  <style>
    .main .logo {
      margin-top: 0;
      height: auto;
    }

    .main .logo a {
      display: flex;
      align-items: center;
    }

    .main .logo .sub-title {
      margin-left: 0.5em;
      font-size: 22px;
      color: #fff;
      background: linear-gradient(-45deg, #3967FF, #B500FE);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
  </style>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
      
    </a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon iconfont">&#xf0179;</span>
                <div class="name">购物车空</div>
                <div class="code-name">&amp;#xf0179;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#x3448;</span>
                <div class="name">手机</div>
                <div class="code-name">&amp;#x3448;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63f;</span>
                <div class="name">购物车</div>
                <div class="code-name">&amp;#xe63f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe692;</span>
                <div class="name">手机</div>
                <div class="code-name">&amp;#xe692;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe899;</span>
                <div class="name"> 购物车</div>
                <div class="code-name">&amp;#xe899;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec2e;</span>
                <div class="name">客服</div>
                <div class="code-name">&amp;#xec2e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ac;</span>
                <div class="name">百分比</div>
                <div class="code-name">&amp;#xe6ac;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ad;</span>
                <div class="name">日志</div>
                <div class="code-name">&amp;#xe6ad;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ae;</span>
                <div class="name">文章</div>
                <div class="code-name">&amp;#xe6ae;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6af;</span>
                <div class="name">抵用券</div>
                <div class="code-name">&amp;#xe6af;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b0;</span>
                <div class="name">语言切换</div>
                <div class="code-name">&amp;#xe6b0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b1;</span>
                <div class="name">存储</div>
                <div class="code-name">&amp;#xe6b1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b2;</span>
                <div class="name">查找</div>
                <div class="code-name">&amp;#xe6b2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b3;</span>
                <div class="name">定位</div>
                <div class="code-name">&amp;#xe6b3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b4;</span>
                <div class="name">消息</div>
                <div class="code-name">&amp;#xe6b4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b5;</span>
                <div class="name">扫描</div>
                <div class="code-name">&amp;#xe6b5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b6;</span>
                <div class="name">下载</div>
                <div class="code-name">&amp;#xe6b6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b7;</span>
                <div class="name">分享</div>
                <div class="code-name">&amp;#xe6b7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b8;</span>
                <div class="name">客服</div>
                <div class="code-name">&amp;#xe6b8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b9;</span>
                <div class="name">上传</div>
                <div class="code-name">&amp;#xe6b9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ba;</span>
                <div class="name">设置</div>
                <div class="code-name">&amp;#xe6ba;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bb;</span>
                <div class="name">照相机</div>
                <div class="code-name">&amp;#xe6bb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bc;</span>
                <div class="name">监测</div>
                <div class="code-name">&amp;#xe6bc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bd;</span>
                <div class="name">打印</div>
                <div class="code-name">&amp;#xe6bd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6be;</span>
                <div class="name">我的</div>
                <div class="code-name">&amp;#xe6be;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bf;</span>
                <div class="name">对话</div>
                <div class="code-name">&amp;#xe6bf;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c0;</span>
                <div class="name">店铺</div>
                <div class="code-name">&amp;#xe6c0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c1;</span>
                <div class="name">删除</div>
                <div class="code-name">&amp;#xe6c1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c2;</span>
                <div class="name">刷新</div>
                <div class="code-name">&amp;#xe6c2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c3;</span>
                <div class="name">视频</div>
                <div class="code-name">&amp;#xe6c3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c4;</span>
                <div class="name">我们</div>
                <div class="code-name">&amp;#xe6c4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c5;</span>
                <div class="name">倒计时</div>
                <div class="code-name">&amp;#xe6c5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c6;</span>
                <div class="name">安全</div>
                <div class="code-name">&amp;#xe6c6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c7;</span>
                <div class="name">签到</div>
                <div class="code-name">&amp;#xe6c7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64d;</span>
                <div class="name">返回的</div>
                <div class="code-name">&amp;#xe64d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64e;</span>
                <div class="name">在线编辑</div>
                <div class="code-name">&amp;#xe64e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64f;</span>
                <div class="name">云</div>
                <div class="code-name">&amp;#xe64f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe650;</span>
                <div class="name">工单</div>
                <div class="code-name">&amp;#xe650;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe651;</span>
                <div class="name">右下</div>
                <div class="code-name">&amp;#xe651;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe652;</span>
                <div class="name">左箭头</div>
                <div class="code-name">&amp;#xe652;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe653;</span>
                <div class="name">右侧</div>
                <div class="code-name">&amp;#xe653;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe654;</span>
                <div class="name">左侧</div>
                <div class="code-name">&amp;#xe654;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe655;</span>
                <div class="name">右上</div>
                <div class="code-name">&amp;#xe655;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe656;</span>
                <div class="name">左上</div>
                <div class="code-name">&amp;#xe656;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe657;</span>
                <div class="name">左</div>
                <div class="code-name">&amp;#xe657;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe658;</span>
                <div class="name">右</div>
                <div class="code-name">&amp;#xe658;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe659;</span>
                <div class="name">往来用户</div>
                <div class="code-name">&amp;#xe659;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65a;</span>
                <div class="name">向左</div>
                <div class="code-name">&amp;#xe65a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65b;</span>
                <div class="name">分享</div>
                <div class="code-name">&amp;#xe65b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65c;</span>
                <div class="name">右箭头</div>
                <div class="code-name">&amp;#xe65c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65d;</span>
                <div class="name">退出</div>
                <div class="code-name">&amp;#xe65d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65e;</span>
                <div class="name">店铺</div>
                <div class="code-name">&amp;#xe65e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65f;</span>
                <div class="name">用户完成</div>
                <div class="code-name">&amp;#xe65f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe660;</span>
                <div class="name">向右</div>
                <div class="code-name">&amp;#xe660;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe661;</span>
                <div class="name">全部回复</div>
                <div class="code-name">&amp;#xe661;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe662;</span>
                <div class="name">点赞</div>
                <div class="code-name">&amp;#xe662;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe663;</span>
                <div class="name">公司</div>
                <div class="code-name">&amp;#xe663;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe664;</span>
                <div class="name">左下</div>
                <div class="code-name">&amp;#xe664;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe665;</span>
                <div class="name">沙漏</div>
                <div class="code-name">&amp;#xe665;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe666;</span>
                <div class="name">表单编辑</div>
                <div class="code-name">&amp;#xe666;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe667;</span>
                <div class="name">待办</div>
                <div class="code-name">&amp;#xe667;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe668;</span>
                <div class="name">垃圾删除</div>
                <div class="code-name">&amp;#xe668;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe669;</span>
                <div class="name">复制</div>
                <div class="code-name">&amp;#xe669;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66a;</span>
                <div class="name">电脑</div>
                <div class="code-name">&amp;#xe66a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66b;</span>
                <div class="name">手机</div>
                <div class="code-name">&amp;#xe66b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66c;</span>
                <div class="name">安全盾牌</div>
                <div class="code-name">&amp;#xe66c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66d;</span>
                <div class="name">音频</div>
                <div class="code-name">&amp;#xe66d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66e;</span>
                <div class="name">查看</div>
                <div class="code-name">&amp;#xe66e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66f;</span>
                <div class="name">今日用户</div>
                <div class="code-name">&amp;#xe66f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe670;</span>
                <div class="name">附件</div>
                <div class="code-name">&amp;#xe670;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe671;</span>
                <div class="name">回复</div>
                <div class="code-name">&amp;#xe671;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe672;</span>
                <div class="name">断开</div>
                <div class="code-name">&amp;#xe672;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe673;</span>
                <div class="name">置顶</div>
                <div class="code-name">&amp;#xe673;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe674;</span>
                <div class="name">书本</div>
                <div class="code-name">&amp;#xe674;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe715;</span>
                <div class="name">home-Outline</div>
                <div class="code-name">&amp;#xe715;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe716;</span>
                <div class="name">home-Fill</div>
                <div class="code-name">&amp;#xe716;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe717;</span>
                <div class="name">read-Outline</div>
                <div class="code-name">&amp;#xe717;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe718;</span>
                <div class="name">read-Fill</div>
                <div class="code-name">&amp;#xe718;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe719;</span>
                <div class="name">write-Outline</div>
                <div class="code-name">&amp;#xe719;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71a;</span>
                <div class="name">write-Fill</div>
                <div class="code-name">&amp;#xe71a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71b;</span>
                <div class="name">tags-Outline</div>
                <div class="code-name">&amp;#xe71b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71c;</span>
                <div class="name">tags-Fill</div>
                <div class="code-name">&amp;#xe71c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71d;</span>
                <div class="name">mine-Outline</div>
                <div class="code-name">&amp;#xe71d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71e;</span>
                <div class="name">mine-Fill</div>
                <div class="code-name">&amp;#xe71e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71f;</span>
                <div class="name">Notes-Outline</div>
                <div class="code-name">&amp;#xe71f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe720;</span>
                <div class="name">Notes-Fill</div>
                <div class="code-name">&amp;#xe720;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe721;</span>
                <div class="name">Note-Outline</div>
                <div class="code-name">&amp;#xe721;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe722;</span>
                <div class="name">Note-Fill</div>
                <div class="code-name">&amp;#xe722;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe723;</span>
                <div class="name">Tag-Outline</div>
                <div class="code-name">&amp;#xe723;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe724;</span>
                <div class="name">Tag-Fill</div>
                <div class="code-name">&amp;#xe724;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe725;</span>
                <div class="name">Delate-Outline</div>
                <div class="code-name">&amp;#xe725;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe726;</span>
                <div class="name">Delate-Fill</div>
                <div class="code-name">&amp;#xe726;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61f;</span>
                <div class="name">icon_人员组织同步</div>
                <div class="code-name">&amp;#xe61f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61e;</span>
                <div class="name">icon_数据中台</div>
                <div class="code-name">&amp;#xe61e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe620;</span>
                <div class="name">icon_通行时间计划</div>
                <div class="code-name">&amp;#xe620;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe621;</span>
                <div class="name">icon_人员通行组</div>
                <div class="code-name">&amp;#xe621;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe622;</span>
                <div class="name">icon_在线阅卷</div>
                <div class="code-name">&amp;#xe622;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe623;</span>
                <div class="name">icon_学生错题</div>
                <div class="code-name">&amp;#xe623;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe624;</span>
                <div class="name">icon_学期报告</div>
                <div class="code-name">&amp;#xe624;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe625;</span>
                <div class="name">icon_网上作业</div>
                <div class="code-name">&amp;#xe625;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe626;</span>
                <div class="name">icon_线下作业</div>
                <div class="code-name">&amp;#xe626;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe627;</span>
                <div class="name">icon_轨迹地图配置</div>
                <div class="code-name">&amp;#xe627;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe628;</span>
                <div class="name">icon_考试管理</div>
                <div class="code-name">&amp;#xe628;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe629;</span>
                <div class="name">icon_教材管理</div>
                <div class="code-name">&amp;#xe629;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62a;</span>
                <div class="name">icon_走班分班</div>
                <div class="code-name">&amp;#xe62a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62b;</span>
                <div class="name">icon_知识树</div>
                <div class="code-name">&amp;#xe62b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62c;</span>
                <div class="name">icon_教辅管理</div>
                <div class="code-name">&amp;#xe62c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62d;</span>
                <div class="name">icon_成绩导入</div>
                <div class="code-name">&amp;#xe62d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62e;</span>
                <div class="name">icon_走班排课</div>
                <div class="code-name">&amp;#xe62e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62f;</span>
                <div class="name">icon_教学监控</div>
                <div class="code-name">&amp;#xe62f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe630;</span>
                <div class="name">icon_校内组卷</div>
                <div class="code-name">&amp;#xe630;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe631;</span>
                <div class="name">icon_上课考勤配置</div>
                <div class="code-name">&amp;#xe631;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe632;</span>
                <div class="name">icon_考务管理</div>
                <div class="code-name">&amp;#xe632;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe633;</span>
                <div class="name">icon_人脸库</div>
                <div class="code-name">&amp;#xe633;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe634;</span>
                <div class="name">icon_教师课时统计</div>
                <div class="code-name">&amp;#xe634;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe635;</span>
                <div class="name">icon_临时调代课</div>
                <div class="code-name">&amp;#xe635;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe636;</span>
                <div class="name">icon_人员同步状态查询</div>
                <div class="code-name">&amp;#xe636;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe637;</span>
                <div class="name">icon_答题卡管理</div>
                <div class="code-name">&amp;#xe637;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe638;</span>
                <div class="name">icon_课时配置</div>
                <div class="code-name">&amp;#xe638;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe639;</span>
                <div class="name">icon_课业点评导出</div>
                <div class="code-name">&amp;#xe639;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63a;</span>
                <div class="name">icon_新高考选科</div>
                <div class="code-name">&amp;#xe63a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63b;</span>
                <div class="name">icon_科目管理</div>
                <div class="code-name">&amp;#xe63b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63c;</span>
                <div class="name">icon_校内通知</div>
                <div class="code-name">&amp;#xe63c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63d;</span>
                <div class="name">icon_成绩配置</div>
                <div class="code-name">&amp;#xe63d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63e;</span>
                <div class="name">icon_教学范围配置</div>
                <div class="code-name">&amp;#xe63e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe640;</span>
                <div class="name">icon_医务室管理</div>
                <div class="code-name">&amp;#xe640;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe641;</span>
                <div class="name">icon_课程管理</div>
                <div class="code-name">&amp;#xe641;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe642;</span>
                <div class="name">icon_教师请假记录</div>
                <div class="code-name">&amp;#xe642;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe643;</span>
                <div class="name">icon_校本题库</div>
                <div class="code-name">&amp;#xe643;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe644;</span>
                <div class="name">icon_评语填写</div>
                <div class="code-name">&amp;#xe644;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe645;</span>
                <div class="name">icon_德育配置</div>
                <div class="code-name">&amp;#xe645;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe646;</span>
                <div class="name">icon_选修课选课</div>
                <div class="code-name">&amp;#xe646;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe647;</span>
                <div class="name">icon_教学班管理</div>
                <div class="code-name">&amp;#xe647;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe648;</span>
                <div class="name">icon_学生出入考勤配置</div>
                <div class="code-name">&amp;#xe648;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe649;</span>
                <div class="name">icon_异常人员管理</div>
                <div class="code-name">&amp;#xe649;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64a;</span>
                <div class="name">icon_评语管理</div>
                <div class="code-name">&amp;#xe64a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64b;</span>
                <div class="name">icon_测温规则配置</div>
                <div class="code-name">&amp;#xe64b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64c;</span>
                <div class="name">icon_学生健康档案</div>
                <div class="code-name">&amp;#xe64c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe675;</span>
                <div class="name">icon_晚自习座位管理</div>
                <div class="code-name">&amp;#xe675;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe676;</span>
                <div class="name">icon_人员通行管控</div>
                <div class="code-name">&amp;#xe676;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe677;</span>
                <div class="name">icon_告警中心</div>
                <div class="code-name">&amp;#xe677;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe678;</span>
                <div class="name">icon_测温记录</div>
                <div class="code-name">&amp;#xe678;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe679;</span>
                <div class="name">icon_调代课记录</div>
                <div class="code-name">&amp;#xe679;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67a;</span>
                <div class="name">icon_班级风采</div>
                <div class="code-name">&amp;#xe67a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67b;</span>
                <div class="name">icon_人员通行记录</div>
                <div class="code-name">&amp;#xe67b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67c;</span>
                <div class="name">icon_班牌管控</div>
                <div class="code-name">&amp;#xe67c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67d;</span>
                <div class="name">icon_教职工巡更</div>
                <div class="code-name">&amp;#xe67d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67e;</span>
                <div class="name">icon_公文收发</div>
                <div class="code-name">&amp;#xe67e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67f;</span>
                <div class="name">icon_审批流程配置</div>
                <div class="code-name">&amp;#xe67f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe680;</span>
                <div class="name">icon_文印申请</div>
                <div class="code-name">&amp;#xe680;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe681;</span>
                <div class="name">icon_设备管理</div>
                <div class="code-name">&amp;#xe681;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe682;</span>
                <div class="name">icon_部门管理</div>
                <div class="code-name">&amp;#xe682;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe683;</span>
                <div class="name">icon_公文库</div>
                <div class="code-name">&amp;#xe683;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe684;</span>
                <div class="name">icon_场地管理</div>
                <div class="code-name">&amp;#xe684;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe685;</span>
                <div class="name">icon_班牌签到事件</div>
                <div class="code-name">&amp;#xe685;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe686;</span>
                <div class="name">icon_教职工管理</div>
                <div class="code-name">&amp;#xe686;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe687;</span>
                <div class="name">icon_学生请假记录</div>
                <div class="code-name">&amp;#xe687;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe688;</span>
                <div class="name">icon_新闻公告</div>
                <div class="code-name">&amp;#xe688;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe689;</span>
                <div class="name">icon_通校生管理</div>
                <div class="code-name">&amp;#xe689;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68a;</span>
                <div class="name">icon_宿舍卡申请管理</div>
                <div class="code-name">&amp;#xe68a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68b;</span>
                <div class="name">icon_审批记录</div>
                <div class="code-name">&amp;#xe68b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68c;</span>
                <div class="name">icon_学生分组配置</div>
                <div class="code-name">&amp;#xe68c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68d;</span>
                <div class="name">icon_收文模版管理</div>
                <div class="code-name">&amp;#xe68d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68e;</span>
                <div class="name">icon_文印室管理</div>
                <div class="code-name">&amp;#xe68e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68f;</span>
                <div class="name">icon_寝室管理</div>
                <div class="code-name">&amp;#xe68f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe690;</span>
                <div class="name">icon_查看课表</div>
                <div class="code-name">&amp;#xe690;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe691;</span>
                <div class="name">icon_学业报告</div>
                <div class="code-name">&amp;#xe691;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe693;</span>
                <div class="name">icon_学生管理</div>
                <div class="code-name">&amp;#xe693;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe727;</span>
                <div class="name">Subscribe-Outline</div>
                <div class="code-name">&amp;#xe727;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe728;</span>
                <div class="name">Subscribe-Fill</div>
                <div class="code-name">&amp;#xe728;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe729;</span>
                <div class="name">System-Outline</div>
                <div class="code-name">&amp;#xe729;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72a;</span>
                <div class="name">System-Fill</div>
                <div class="code-name">&amp;#xe72a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72b;</span>
                <div class="name">Collect-Outline</div>
                <div class="code-name">&amp;#xe72b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72c;</span>
                <div class="name">Collect-Fill</div>
                <div class="code-name">&amp;#xe72c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72d;</span>
                <div class="name">Arrow-Big</div>
                <div class="code-name">&amp;#xe72d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72e;</span>
                <div class="name">Arrow-Double</div>
                <div class="code-name">&amp;#xe72e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72f;</span>
                <div class="name">Arrow-Small</div>
                <div class="code-name">&amp;#xe72f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe730;</span>
                <div class="name">Arrow-Square</div>
                <div class="code-name">&amp;#xe730;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe731;</span>
                <div class="name">Search</div>
                <div class="code-name">&amp;#xe731;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe732;</span>
                <div class="name">Notice</div>
                <div class="code-name">&amp;#xe732;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe733;</span>
                <div class="name">Upload</div>
                <div class="code-name">&amp;#xe733;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe734;</span>
                <div class="name">Download</div>
                <div class="code-name">&amp;#xe734;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe735;</span>
                <div class="name">Special</div>
                <div class="code-name">&amp;#xe735;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe736;</span>
                <div class="name">Article</div>
                <div class="code-name">&amp;#xe736;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe737;</span>
                <div class="name">Mind</div>
                <div class="code-name">&amp;#xe737;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe738;</span>
                <div class="name">Kaiti</div>
                <div class="code-name">&amp;#xe738;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe739;</span>
                <div class="name">Contribution</div>
                <div class="code-name">&amp;#xe739;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73a;</span>
                <div class="name">Achievements</div>
                <div class="code-name">&amp;#xe73a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73b;</span>
                <div class="name">Menber</div>
                <div class="code-name">&amp;#xe73b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73c;</span>
                <div class="name">Package</div>
                <div class="code-name">&amp;#xe73c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73d;</span>
                <div class="name">Sign out</div>
                <div class="code-name">&amp;#xe73d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73e;</span>
                <div class="name">Set up</div>
                <div class="code-name">&amp;#xe73e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73f;</span>
                <div class="name">Team</div>
                <div class="code-name">&amp;#xe73f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe740;</span>
                <div class="name">More</div>
                <div class="code-name">&amp;#xe740;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe601;</span>
                <div class="name">图片</div>
                <div class="code-name">&amp;#xe601;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe602;</span>
                <div class="name">排序</div>
                <div class="code-name">&amp;#xe602;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe603;</span>
                <div class="name">消息</div>
                <div class="code-name">&amp;#xe603;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe604;</span>
                <div class="name">筛选</div>
                <div class="code-name">&amp;#xe604;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe605;</span>
                <div class="name">前进</div>
                <div class="code-name">&amp;#xe605;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe606;</span>
                <div class="name">不可见</div>
                <div class="code-name">&amp;#xe606;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe607;</span>
                <div class="name">添加</div>
                <div class="code-name">&amp;#xe607;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe608;</span>
                <div class="name">同步时间</div>
                <div class="code-name">&amp;#xe608;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe609;</span>
                <div class="name">设置</div>
                <div class="code-name">&amp;#xe609;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60a;</span>
                <div class="name">帮助</div>
                <div class="code-name">&amp;#xe60a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60b;</span>
                <div class="name">刷新</div>
                <div class="code-name">&amp;#xe60b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60c;</span>
                <div class="name">删除</div>
                <div class="code-name">&amp;#xe60c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60d;</span>
                <div class="name">密码</div>
                <div class="code-name">&amp;#xe60d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60e;</span>
                <div class="name">编辑</div>
                <div class="code-name">&amp;#xe60e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60f;</span>
                <div class="name">返回</div>
                <div class="code-name">&amp;#xe60f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe610;</span>
                <div class="name">用户</div>
                <div class="code-name">&amp;#xe610;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe611;</span>
                <div class="name">日历</div>
                <div class="code-name">&amp;#xe611;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe612;</span>
                <div class="name">告警</div>
                <div class="code-name">&amp;#xe612;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe613;</span>
                <div class="name">开发</div>
                <div class="code-name">&amp;#xe613;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe614;</span>
                <div class="name">日志</div>
                <div class="code-name">&amp;#xe614;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe615;</span>
                <div class="name">关闭</div>
                <div class="code-name">&amp;#xe615;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe616;</span>
                <div class="name">搜索</div>
                <div class="code-name">&amp;#xe616;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe617;</span>
                <div class="name">网络设备</div>
                <div class="code-name">&amp;#xe617;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe618;</span>
                <div class="name">导入</div>
                <div class="code-name">&amp;#xe618;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe619;</span>
                <div class="name">cpu</div>
                <div class="code-name">&amp;#xe619;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61a;</span>
                <div class="name">客户端</div>
                <div class="code-name">&amp;#xe61a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61b;</span>
                <div class="name">控制器</div>
                <div class="code-name">&amp;#xe61b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61c;</span>
                <div class="name">网络专线</div>
                <div class="code-name">&amp;#xe61c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61d;</span>
                <div class="name">虚拟机</div>
                <div class="code-name">&amp;#xe61d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe694;</span>
                <div class="name">内存卡</div>
                <div class="code-name">&amp;#xe694;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe695;</span>
                <div class="name">导出</div>
                <div class="code-name">&amp;#xe695;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe696;</span>
                <div class="name">企业</div>
                <div class="code-name">&amp;#xe696;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe697;</span>
                <div class="name">云端下载</div>
                <div class="code-name">&amp;#xe697;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe698;</span>
                <div class="name">管理</div>
                <div class="code-name">&amp;#xe698;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe699;</span>
                <div class="name">关联</div>
                <div class="code-name">&amp;#xe699;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69a;</span>
                <div class="name">应用</div>
                <div class="code-name">&amp;#xe69a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69b;</span>
                <div class="name">扩展</div>
                <div class="code-name">&amp;#xe69b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69c;</span>
                <div class="name">云端连接</div>
                <div class="code-name">&amp;#xe69c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69d;</span>
                <div class="name">服务器</div>
                <div class="code-name">&amp;#xe69d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69e;</span>
                <div class="name">分享</div>
                <div class="code-name">&amp;#xe69e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69f;</span>
                <div class="name">断开</div>
                <div class="code-name">&amp;#xe69f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a0;</span>
                <div class="name">安全</div>
                <div class="code-name">&amp;#xe6a0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a1;</span>
                <div class="name">云端上传</div>
                <div class="code-name">&amp;#xe6a1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a2;</span>
                <div class="name">可见</div>
                <div class="code-name">&amp;#xe6a2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a3;</span>
                <div class="name">修剪</div>
                <div class="code-name">&amp;#xe6a3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a4;</span>
                <div class="name">校对</div>
                <div class="code-name">&amp;#xe6a4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a5;</span>
                <div class="name">查询记录</div>
                <div class="code-name">&amp;#xe6a5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a6;</span>
                <div class="name">存储</div>
                <div class="code-name">&amp;#xe6a6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a7;</span>
                <div class="name">文件</div>
                <div class="code-name">&amp;#xe6a7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a8;</span>
                <div class="name">icon_课表导入</div>
                <div class="code-name">&amp;#xe6a8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a9;</span>
                <div class="name">icon_事假</div>
                <div class="code-name">&amp;#xe6a9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6aa;</span>
                <div class="name">icon_学期配置</div>
                <div class="code-name">&amp;#xe6aa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ab;</span>
                <div class="name">icon_专业管理</div>
                <div class="code-name">&amp;#xe6ab;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'iconfont';
  src: url('iconfont.ttf?t=1664007922369') format('truetype');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon iconfont icon-gouwuchekong"></span>
            <div class="name">
              购物车空
            </div>
            <div class="code-name">.icon-gouwuchekong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shouji"></span>
            <div class="name">
              手机
            </div>
            <div class="code-name">.icon-shouji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gouwuche"></span>
            <div class="name">
              购物车
            </div>
            <div class="code-name">.icon-gouwuche
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shouji1"></span>
            <div class="name">
              手机
            </div>
            <div class="code-name">.icon-shouji1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gouwuche1"></span>
            <div class="name">
               购物车
            </div>
            <div class="code-name">.icon-gouwuche1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-kefu"></span>
            <div class="name">
              客服
            </div>
            <div class="code-name">.icon-kefu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A"></span>
            <div class="name">
              百分比
            </div>
            <div class="code-name">.icon-icon_A
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A1"></span>
            <div class="name">
              日志
            </div>
            <div class="code-name">.icon-icon_A1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A2"></span>
            <div class="name">
              文章
            </div>
            <div class="code-name">.icon-icon_A2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A3"></span>
            <div class="name">
              抵用券
            </div>
            <div class="code-name">.icon-icon_A3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A4"></span>
            <div class="name">
              语言切换
            </div>
            <div class="code-name">.icon-icon_A4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A5"></span>
            <div class="name">
              存储
            </div>
            <div class="code-name">.icon-icon_A5
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A6"></span>
            <div class="name">
              查找
            </div>
            <div class="code-name">.icon-icon_A6
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A7"></span>
            <div class="name">
              定位
            </div>
            <div class="code-name">.icon-icon_A7
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A8"></span>
            <div class="name">
              消息
            </div>
            <div class="code-name">.icon-icon_A8
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A9"></span>
            <div class="name">
              扫描
            </div>
            <div class="code-name">.icon-icon_A9
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A10"></span>
            <div class="name">
              下载
            </div>
            <div class="code-name">.icon-icon_A10
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A11"></span>
            <div class="name">
              分享
            </div>
            <div class="code-name">.icon-icon_A11
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A12"></span>
            <div class="name">
              客服
            </div>
            <div class="code-name">.icon-icon_A12
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A13"></span>
            <div class="name">
              上传
            </div>
            <div class="code-name">.icon-icon_A13
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A14"></span>
            <div class="name">
              设置
            </div>
            <div class="code-name">.icon-icon_A14
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A15"></span>
            <div class="name">
              照相机
            </div>
            <div class="code-name">.icon-icon_A15
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A16"></span>
            <div class="name">
              监测
            </div>
            <div class="code-name">.icon-icon_A16
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A17"></span>
            <div class="name">
              打印
            </div>
            <div class="code-name">.icon-icon_A17
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A18"></span>
            <div class="name">
              我的
            </div>
            <div class="code-name">.icon-icon_A18
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A19"></span>
            <div class="name">
              对话
            </div>
            <div class="code-name">.icon-icon_A19
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A20"></span>
            <div class="name">
              店铺
            </div>
            <div class="code-name">.icon-icon_A20
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A21"></span>
            <div class="name">
              删除
            </div>
            <div class="code-name">.icon-icon_A21
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A22"></span>
            <div class="name">
              刷新
            </div>
            <div class="code-name">.icon-icon_A22
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A23"></span>
            <div class="name">
              视频
            </div>
            <div class="code-name">.icon-icon_A23
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A24"></span>
            <div class="name">
              我们
            </div>
            <div class="code-name">.icon-icon_A24
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A25"></span>
            <div class="name">
              倒计时
            </div>
            <div class="code-name">.icon-icon_A25
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A26"></span>
            <div class="name">
              安全
            </div>
            <div class="code-name">.icon-icon_A26
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_A27"></span>
            <div class="name">
              签到
            </div>
            <div class="code-name">.icon-icon_A27
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fanhuide"></span>
            <div class="name">
              返回的
            </div>
            <div class="code-name">.icon-fanhuide
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zaixianbianji"></span>
            <div class="name">
              在线编辑
            </div>
            <div class="code-name">.icon-zaixianbianji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yun"></span>
            <div class="name">
              云
            </div>
            <div class="code-name">.icon-yun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gongdan"></span>
            <div class="name">
              工单
            </div>
            <div class="code-name">.icon-gongdan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-youxia"></span>
            <div class="name">
              右下
            </div>
            <div class="code-name">.icon-youxia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zuojiantou"></span>
            <div class="name">
              左箭头
            </div>
            <div class="code-name">.icon-zuojiantou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-youce"></span>
            <div class="name">
              右侧
            </div>
            <div class="code-name">.icon-youce
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zuoce"></span>
            <div class="name">
              左侧
            </div>
            <div class="code-name">.icon-zuoce
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-youshang"></span>
            <div class="name">
              右上
            </div>
            <div class="code-name">.icon-youshang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zuoshang"></span>
            <div class="name">
              左上
            </div>
            <div class="code-name">.icon-zuoshang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zuo"></span>
            <div class="name">
              左
            </div>
            <div class="code-name">.icon-zuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-you"></span>
            <div class="name">
              右
            </div>
            <div class="code-name">.icon-you
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wanglaiyonghu"></span>
            <div class="name">
              往来用户
            </div>
            <div class="code-name">.icon-wanglaiyonghu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiangzuo"></span>
            <div class="name">
              向左
            </div>
            <div class="code-name">.icon-xiangzuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fenxiang"></span>
            <div class="name">
              分享
            </div>
            <div class="code-name">.icon-fenxiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-youjiantou"></span>
            <div class="name">
              右箭头
            </div>
            <div class="code-name">.icon-youjiantou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tuichu"></span>
            <div class="name">
              退出
            </div>
            <div class="code-name">.icon-tuichu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dianpu"></span>
            <div class="name">
              店铺
            </div>
            <div class="code-name">.icon-dianpu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yonghuwancheng"></span>
            <div class="name">
              用户完成
            </div>
            <div class="code-name">.icon-yonghuwancheng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiangyou"></span>
            <div class="name">
              向右
            </div>
            <div class="code-name">.icon-xiangyou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-quanbuhuifu"></span>
            <div class="name">
              全部回复
            </div>
            <div class="code-name">.icon-quanbuhuifu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dianzan"></span>
            <div class="name">
              点赞
            </div>
            <div class="code-name">.icon-dianzan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gongsi"></span>
            <div class="name">
              公司
            </div>
            <div class="code-name">.icon-gongsi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zuoxia"></span>
            <div class="name">
              左下
            </div>
            <div class="code-name">.icon-zuoxia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shalou"></span>
            <div class="name">
              沙漏
            </div>
            <div class="code-name">.icon-shalou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaodanbianji"></span>
            <div class="name">
              表单编辑
            </div>
            <div class="code-name">.icon-biaodanbianji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-daiban"></span>
            <div class="name">
              待办
            </div>
            <div class="code-name">.icon-daiban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-lajishanchu"></span>
            <div class="name">
              垃圾删除
            </div>
            <div class="code-name">.icon-lajishanchu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fuzhi"></span>
            <div class="name">
              复制
            </div>
            <div class="code-name">.icon-fuzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-diannao"></span>
            <div class="name">
              电脑
            </div>
            <div class="code-name">.icon-diannao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shouji2"></span>
            <div class="name">
              手机
            </div>
            <div class="code-name">.icon-shouji2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-anquandunpai"></span>
            <div class="name">
              安全盾牌
            </div>
            <div class="code-name">.icon-anquandunpai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yinpin"></span>
            <div class="name">
              音频
            </div>
            <div class="code-name">.icon-yinpin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-chakan"></span>
            <div class="name">
              查看
            </div>
            <div class="code-name">.icon-chakan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jinriyonghu"></span>
            <div class="name">
              今日用户
            </div>
            <div class="code-name">.icon-jinriyonghu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fujian"></span>
            <div class="name">
              附件
            </div>
            <div class="code-name">.icon-fujian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-huifu"></span>
            <div class="name">
              回复
            </div>
            <div class="code-name">.icon-huifu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-duankai"></span>
            <div class="name">
              断开
            </div>
            <div class="code-name">.icon-duankai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhiding"></span>
            <div class="name">
              置顶
            </div>
            <div class="code-name">.icon-zhiding
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuben"></span>
            <div class="name">
              书本
            </div>
            <div class="code-name">.icon-shuben
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-home-Outline"></span>
            <div class="name">
              home-Outline
            </div>
            <div class="code-name">.icon-home-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-home-Fill"></span>
            <div class="name">
              home-Fill
            </div>
            <div class="code-name">.icon-home-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-read-Outline"></span>
            <div class="name">
              read-Outline
            </div>
            <div class="code-name">.icon-read-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-read-Fill"></span>
            <div class="name">
              read-Fill
            </div>
            <div class="code-name">.icon-read-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-write-Outline"></span>
            <div class="name">
              write-Outline
            </div>
            <div class="code-name">.icon-write-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-write-Fill"></span>
            <div class="name">
              write-Fill
            </div>
            <div class="code-name">.icon-write-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tags-Outline"></span>
            <div class="name">
              tags-Outline
            </div>
            <div class="code-name">.icon-tags-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tags-Fill"></span>
            <div class="name">
              tags-Fill
            </div>
            <div class="code-name">.icon-tags-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mine-Outline"></span>
            <div class="name">
              mine-Outline
            </div>
            <div class="code-name">.icon-mine-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mine-Fill"></span>
            <div class="name">
              mine-Fill
            </div>
            <div class="code-name">.icon-mine-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Notes-Outline"></span>
            <div class="name">
              Notes-Outline
            </div>
            <div class="code-name">.icon-Notes-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Notes-Fill"></span>
            <div class="name">
              Notes-Fill
            </div>
            <div class="code-name">.icon-Notes-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Note-Outline"></span>
            <div class="name">
              Note-Outline
            </div>
            <div class="code-name">.icon-Note-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Note-Fill"></span>
            <div class="name">
              Note-Fill
            </div>
            <div class="code-name">.icon-Note-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Tag-Outline"></span>
            <div class="name">
              Tag-Outline
            </div>
            <div class="code-name">.icon-Tag-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Tag-Fill"></span>
            <div class="name">
              Tag-Fill
            </div>
            <div class="code-name">.icon-Tag-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Delate-Outline"></span>
            <div class="name">
              Delate-Outline
            </div>
            <div class="code-name">.icon-Delate-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Delate-Fill"></span>
            <div class="name">
              Delate-Fill
            </div>
            <div class="code-name">.icon-Delate-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_renyuanzuzhitongbu"></span>
            <div class="name">
              icon_人员组织同步
            </div>
            <div class="code-name">.icon-icon_renyuanzuzhitongbu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_shujuzhongtai"></span>
            <div class="name">
              icon_数据中台
            </div>
            <div class="code-name">.icon-icon_shujuzhongtai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_tonghangshijianjihua"></span>
            <div class="name">
              icon_通行时间计划
            </div>
            <div class="code-name">.icon-icon_tonghangshijianjihua
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_renyuantonghangzu"></span>
            <div class="name">
              icon_人员通行组
            </div>
            <div class="code-name">.icon-icon_renyuantonghangzu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_zaixianyuejuan"></span>
            <div class="name">
              icon_在线阅卷
            </div>
            <div class="code-name">.icon-icon_zaixianyuejuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xueshengcuoti"></span>
            <div class="name">
              icon_学生错题
            </div>
            <div class="code-name">.icon-icon_xueshengcuoti
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xueqibaogao"></span>
            <div class="name">
              icon_学期报告
            </div>
            <div class="code-name">.icon-icon_xueqibaogao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_wangshangzuoye"></span>
            <div class="name">
              icon_网上作业
            </div>
            <div class="code-name">.icon-icon_wangshangzuoye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xianxiazuoye"></span>
            <div class="name">
              icon_线下作业
            </div>
            <div class="code-name">.icon-icon_xianxiazuoye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_guijiditupeizhi"></span>
            <div class="name">
              icon_轨迹地图配置
            </div>
            <div class="code-name">.icon-icon_guijiditupeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_kaoshiguanli"></span>
            <div class="name">
              icon_考试管理
            </div>
            <div class="code-name">.icon-icon_kaoshiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_jiaocaiguanli"></span>
            <div class="name">
              icon_教材管理
            </div>
            <div class="code-name">.icon-icon_jiaocaiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_zoubanfenban"></span>
            <div class="name">
              icon_走班分班
            </div>
            <div class="code-name">.icon-icon_zoubanfenban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_zhishishu"></span>
            <div class="name">
              icon_知识树
            </div>
            <div class="code-name">.icon-icon_zhishishu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_jiaofuguanli"></span>
            <div class="name">
              icon_教辅管理
            </div>
            <div class="code-name">.icon-icon_jiaofuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_chengjidaoru"></span>
            <div class="name">
              icon_成绩导入
            </div>
            <div class="code-name">.icon-icon_chengjidaoru
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_zoubanpaike"></span>
            <div class="name">
              icon_走班排课
            </div>
            <div class="code-name">.icon-icon_zoubanpaike
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_jiaoxuejiankong"></span>
            <div class="name">
              icon_教学监控
            </div>
            <div class="code-name">.icon-icon_jiaoxuejiankong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xiaoneizujuan"></span>
            <div class="name">
              icon_校内组卷
            </div>
            <div class="code-name">.icon-icon_xiaoneizujuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_shangkekaoqinpeizhi"></span>
            <div class="name">
              icon_上课考勤配置
            </div>
            <div class="code-name">.icon-icon_shangkekaoqinpeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_kaowuguanli"></span>
            <div class="name">
              icon_考务管理
            </div>
            <div class="code-name">.icon-icon_kaowuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_renlianku"></span>
            <div class="name">
              icon_人脸库
            </div>
            <div class="code-name">.icon-icon_renlianku
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_jiaoshikeshitongji"></span>
            <div class="name">
              icon_教师课时统计
            </div>
            <div class="code-name">.icon-icon_jiaoshikeshitongji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_linshitiaodaike"></span>
            <div class="name">
              icon_临时调代课
            </div>
            <div class="code-name">.icon-icon_linshitiaodaike
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_renyuantongbuzhuangtaichaxun"></span>
            <div class="name">
              icon_人员同步状态查询
            </div>
            <div class="code-name">.icon-icon_renyuantongbuzhuangtaichaxun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_datikaguanli"></span>
            <div class="name">
              icon_答题卡管理
            </div>
            <div class="code-name">.icon-icon_datikaguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_keshipeizhi"></span>
            <div class="name">
              icon_课时配置
            </div>
            <div class="code-name">.icon-icon_keshipeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_keyedianpingdaochu"></span>
            <div class="name">
              icon_课业点评导出
            </div>
            <div class="code-name">.icon-icon_keyedianpingdaochu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xingaokaoxuanke"></span>
            <div class="name">
              icon_新高考选科
            </div>
            <div class="code-name">.icon-icon_xingaokaoxuanke
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_kemuguanli"></span>
            <div class="name">
              icon_科目管理
            </div>
            <div class="code-name">.icon-icon_kemuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xiaoneitongzhi"></span>
            <div class="name">
              icon_校内通知
            </div>
            <div class="code-name">.icon-icon_xiaoneitongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_chengjipeizhi"></span>
            <div class="name">
              icon_成绩配置
            </div>
            <div class="code-name">.icon-icon_chengjipeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_jiaoxuefanweipeizhi"></span>
            <div class="name">
              icon_教学范围配置
            </div>
            <div class="code-name">.icon-icon_jiaoxuefanweipeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_yiwushiguanli"></span>
            <div class="name">
              icon_医务室管理
            </div>
            <div class="code-name">.icon-icon_yiwushiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_kechengguanli"></span>
            <div class="name">
              icon_课程管理
            </div>
            <div class="code-name">.icon-icon_kechengguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_jiaoshiqingjiajilu"></span>
            <div class="name">
              icon_教师请假记录
            </div>
            <div class="code-name">.icon-icon_jiaoshiqingjiajilu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xiaobentiku"></span>
            <div class="name">
              icon_校本题库
            </div>
            <div class="code-name">.icon-icon_xiaobentiku
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_pingyutianxie"></span>
            <div class="name">
              icon_评语填写
            </div>
            <div class="code-name">.icon-icon_pingyutianxie
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_deyupeizhi"></span>
            <div class="name">
              icon_德育配置
            </div>
            <div class="code-name">.icon-icon_deyupeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xuanxiukexuanke"></span>
            <div class="name">
              icon_选修课选课
            </div>
            <div class="code-name">.icon-icon_xuanxiukexuanke
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_jiaoxuebanguanli"></span>
            <div class="name">
              icon_教学班管理
            </div>
            <div class="code-name">.icon-icon_jiaoxuebanguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xueshengchurukaoqinpeizhi"></span>
            <div class="name">
              icon_学生出入考勤配置
            </div>
            <div class="code-name">.icon-icon_xueshengchurukaoqinpeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_yichangrenyuanguanli"></span>
            <div class="name">
              icon_异常人员管理
            </div>
            <div class="code-name">.icon-icon_yichangrenyuanguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_pingyuguanli"></span>
            <div class="name">
              icon_评语管理
            </div>
            <div class="code-name">.icon-icon_pingyuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_cewenguizepeizhi"></span>
            <div class="name">
              icon_测温规则配置
            </div>
            <div class="code-name">.icon-icon_cewenguizepeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xueshengjiankangdangan"></span>
            <div class="name">
              icon_学生健康档案
            </div>
            <div class="code-name">.icon-icon_xueshengjiankangdangan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_wanzixizuoweiguanli"></span>
            <div class="name">
              icon_晚自习座位管理
            </div>
            <div class="code-name">.icon-icon_wanzixizuoweiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_renyuantonghangguankong"></span>
            <div class="name">
              icon_人员通行管控
            </div>
            <div class="code-name">.icon-icon_renyuantonghangguankong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_gaojingzhongxin"></span>
            <div class="name">
              icon_告警中心
            </div>
            <div class="code-name">.icon-icon_gaojingzhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_cewenjilu"></span>
            <div class="name">
              icon_测温记录
            </div>
            <div class="code-name">.icon-icon_cewenjilu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_tiaodaikejilu"></span>
            <div class="name">
              icon_调代课记录
            </div>
            <div class="code-name">.icon-icon_tiaodaikejilu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_banjifengcai"></span>
            <div class="name">
              icon_班级风采
            </div>
            <div class="code-name">.icon-icon_banjifengcai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_renyuantonghangjilu"></span>
            <div class="name">
              icon_人员通行记录
            </div>
            <div class="code-name">.icon-icon_renyuantonghangjilu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_banpaiguankong"></span>
            <div class="name">
              icon_班牌管控
            </div>
            <div class="code-name">.icon-icon_banpaiguankong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_jiaozhigongxungeng"></span>
            <div class="name">
              icon_教职工巡更
            </div>
            <div class="code-name">.icon-icon_jiaozhigongxungeng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_gongwenshoufa"></span>
            <div class="name">
              icon_公文收发
            </div>
            <div class="code-name">.icon-icon_gongwenshoufa
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_shenpiliuchengpeizhi"></span>
            <div class="name">
              icon_审批流程配置
            </div>
            <div class="code-name">.icon-icon_shenpiliuchengpeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_wenyinshenqing"></span>
            <div class="name">
              icon_文印申请
            </div>
            <div class="code-name">.icon-icon_wenyinshenqing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_shebeiguanli"></span>
            <div class="name">
              icon_设备管理
            </div>
            <div class="code-name">.icon-icon_shebeiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_bumenguanli"></span>
            <div class="name">
              icon_部门管理
            </div>
            <div class="code-name">.icon-icon_bumenguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_gongwenku"></span>
            <div class="name">
              icon_公文库
            </div>
            <div class="code-name">.icon-icon_gongwenku
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_changdiguanli"></span>
            <div class="name">
              icon_场地管理
            </div>
            <div class="code-name">.icon-icon_changdiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_banpaiqiandaoshijian"></span>
            <div class="name">
              icon_班牌签到事件
            </div>
            <div class="code-name">.icon-icon_banpaiqiandaoshijian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_jiaozhigongguanli"></span>
            <div class="name">
              icon_教职工管理
            </div>
            <div class="code-name">.icon-icon_jiaozhigongguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xueshengqingjiajilu"></span>
            <div class="name">
              icon_学生请假记录
            </div>
            <div class="code-name">.icon-icon_xueshengqingjiajilu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xinwengonggao"></span>
            <div class="name">
              icon_新闻公告
            </div>
            <div class="code-name">.icon-icon_xinwengonggao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_tongxiaoshengguanli"></span>
            <div class="name">
              icon_通校生管理
            </div>
            <div class="code-name">.icon-icon_tongxiaoshengguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_sushekashenqingguanli"></span>
            <div class="name">
              icon_宿舍卡申请管理
            </div>
            <div class="code-name">.icon-icon_sushekashenqingguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_shenpijilu"></span>
            <div class="name">
              icon_审批记录
            </div>
            <div class="code-name">.icon-icon_shenpijilu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xueshengfenzupeizhi"></span>
            <div class="name">
              icon_学生分组配置
            </div>
            <div class="code-name">.icon-icon_xueshengfenzupeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_shouwenmobanguanli"></span>
            <div class="name">
              icon_收文模版管理
            </div>
            <div class="code-name">.icon-icon_shouwenmobanguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_wenyinshiguanli"></span>
            <div class="name">
              icon_文印室管理
            </div>
            <div class="code-name">.icon-icon_wenyinshiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_qinshiguanli"></span>
            <div class="name">
              icon_寝室管理
            </div>
            <div class="code-name">.icon-icon_qinshiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_chakankebiao"></span>
            <div class="name">
              icon_查看课表
            </div>
            <div class="code-name">.icon-icon_chakankebiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xueyebaogao"></span>
            <div class="name">
              icon_学业报告
            </div>
            <div class="code-name">.icon-icon_xueyebaogao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xueshengguanli"></span>
            <div class="name">
              icon_学生管理
            </div>
            <div class="code-name">.icon-icon_xueshengguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Subscribe-Outline"></span>
            <div class="name">
              Subscribe-Outline
            </div>
            <div class="code-name">.icon-Subscribe-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Subscribe-Fill"></span>
            <div class="name">
              Subscribe-Fill
            </div>
            <div class="code-name">.icon-Subscribe-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-System-Outline"></span>
            <div class="name">
              System-Outline
            </div>
            <div class="code-name">.icon-System-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-System-Fill"></span>
            <div class="name">
              System-Fill
            </div>
            <div class="code-name">.icon-System-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Collect-Outline"></span>
            <div class="name">
              Collect-Outline
            </div>
            <div class="code-name">.icon-Collect-Outline
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Collect-Fill"></span>
            <div class="name">
              Collect-Fill
            </div>
            <div class="code-name">.icon-Collect-Fill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Arrow-Big"></span>
            <div class="name">
              Arrow-Big
            </div>
            <div class="code-name">.icon-Arrow-Big
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Arrow-Double"></span>
            <div class="name">
              Arrow-Double
            </div>
            <div class="code-name">.icon-Arrow-Double
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Arrow-Small"></span>
            <div class="name">
              Arrow-Small
            </div>
            <div class="code-name">.icon-Arrow-Small
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Arrow-Square"></span>
            <div class="name">
              Arrow-Square
            </div>
            <div class="code-name">.icon-Arrow-Square
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Search"></span>
            <div class="name">
              Search
            </div>
            <div class="code-name">.icon-Search
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Notice"></span>
            <div class="name">
              Notice
            </div>
            <div class="code-name">.icon-Notice
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Upload"></span>
            <div class="name">
              Upload
            </div>
            <div class="code-name">.icon-Upload
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Download"></span>
            <div class="name">
              Download
            </div>
            <div class="code-name">.icon-Download
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Special"></span>
            <div class="name">
              Special
            </div>
            <div class="code-name">.icon-Special
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Article"></span>
            <div class="name">
              Article
            </div>
            <div class="code-name">.icon-Article
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Mind"></span>
            <div class="name">
              Mind
            </div>
            <div class="code-name">.icon-Mind
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Kaiti"></span>
            <div class="name">
              Kaiti
            </div>
            <div class="code-name">.icon-Kaiti
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Contribution"></span>
            <div class="name">
              Contribution
            </div>
            <div class="code-name">.icon-Contribution
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Achievements"></span>
            <div class="name">
              Achievements
            </div>
            <div class="code-name">.icon-Achievements
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Menber"></span>
            <div class="name">
              Menber
            </div>
            <div class="code-name">.icon-Menber
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Package"></span>
            <div class="name">
              Package
            </div>
            <div class="code-name">.icon-Package
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-Signout"></span>
            <div class="name">
              Sign out
            </div>
            <div class="code-name">.icon-a-Signout
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-Setup"></span>
            <div class="name">
              Set up
            </div>
            <div class="code-name">.icon-a-Setup
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Team"></span>
            <div class="name">
              Team
            </div>
            <div class="code-name">.icon-Team
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-More"></span>
            <div class="name">
              More
            </div>
            <div class="code-name">.icon-More
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben43"></span>
            <div class="name">
              图片
            </div>
            <div class="code-name">.icon-a-huaban1fuben43
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben46"></span>
            <div class="name">
              排序
            </div>
            <div class="code-name">.icon-a-huaban1fuben46
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben47"></span>
            <div class="name">
              消息
            </div>
            <div class="code-name">.icon-a-huaban1fuben47
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben48"></span>
            <div class="name">
              筛选
            </div>
            <div class="code-name">.icon-a-huaban1fuben48
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben45"></span>
            <div class="name">
              前进
            </div>
            <div class="code-name">.icon-a-huaban1fuben45
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben40"></span>
            <div class="name">
              不可见
            </div>
            <div class="code-name">.icon-a-huaban1fuben40
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianjia"></span>
            <div class="name">
              添加
            </div>
            <div class="code-name">.icon-tianjia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben"></span>
            <div class="name">
              同步时间
            </div>
            <div class="code-name">.icon-a-huaban1fuben
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben42"></span>
            <div class="name">
              设置
            </div>
            <div class="code-name">.icon-a-huaban1fuben42
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben41"></span>
            <div class="name">
              帮助
            </div>
            <div class="code-name">.icon-a-huaban1fuben41
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1"></span>
            <div class="name">
              刷新
            </div>
            <div class="code-name">.icon-a-huaban1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben4"></span>
            <div class="name">
              删除
            </div>
            <div class="code-name">.icon-a-huaban1fuben4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben7"></span>
            <div class="name">
              密码
            </div>
            <div class="code-name">.icon-a-huaban1fuben7
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben3"></span>
            <div class="name">
              编辑
            </div>
            <div class="code-name">.icon-a-huaban1fuben3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben44"></span>
            <div class="name">
              返回
            </div>
            <div class="code-name">.icon-a-huaban1fuben44
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben6"></span>
            <div class="name">
              用户
            </div>
            <div class="code-name">.icon-a-huaban1fuben6
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben5"></span>
            <div class="name">
              日历
            </div>
            <div class="code-name">.icon-a-huaban1fuben5
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben17"></span>
            <div class="name">
              告警
            </div>
            <div class="code-name">.icon-a-huaban1fuben17
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben9"></span>
            <div class="name">
              开发
            </div>
            <div class="code-name">.icon-a-huaban1fuben9
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben21"></span>
            <div class="name">
              日志
            </div>
            <div class="code-name">.icon-a-huaban1fuben21
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben18"></span>
            <div class="name">
              关闭
            </div>
            <div class="code-name">.icon-a-huaban1fuben18
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben19"></span>
            <div class="name">
              搜索
            </div>
            <div class="code-name">.icon-a-huaban1fuben19
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben13"></span>
            <div class="name">
              网络设备
            </div>
            <div class="code-name">.icon-a-huaban1fuben13
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben29"></span>
            <div class="name">
              导入
            </div>
            <div class="code-name">.icon-a-huaban1fuben29
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben15"></span>
            <div class="name">
              cpu
            </div>
            <div class="code-name">.icon-a-huaban1fuben15
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben10"></span>
            <div class="name">
              客户端
            </div>
            <div class="code-name">.icon-a-huaban1fuben10
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben14"></span>
            <div class="name">
              控制器
            </div>
            <div class="code-name">.icon-a-huaban1fuben14
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben16"></span>
            <div class="name">
              网络专线
            </div>
            <div class="code-name">.icon-a-huaban1fuben16
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben26"></span>
            <div class="name">
              虚拟机
            </div>
            <div class="code-name">.icon-a-huaban1fuben26
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben12"></span>
            <div class="name">
              内存卡
            </div>
            <div class="code-name">.icon-a-huaban1fuben12
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben33"></span>
            <div class="name">
              导出
            </div>
            <div class="code-name">.icon-a-huaban1fuben33
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben27"></span>
            <div class="name">
              企业
            </div>
            <div class="code-name">.icon-a-huaban1fuben27
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben24"></span>
            <div class="name">
              云端下载
            </div>
            <div class="code-name">.icon-a-huaban1fuben24
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben22"></span>
            <div class="name">
              管理
            </div>
            <div class="code-name">.icon-a-huaban1fuben22
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben8"></span>
            <div class="name">
              关联
            </div>
            <div class="code-name">.icon-a-huaban1fuben8
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben35"></span>
            <div class="name">
              应用
            </div>
            <div class="code-name">.icon-a-huaban1fuben35
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben32"></span>
            <div class="name">
              扩展
            </div>
            <div class="code-name">.icon-a-huaban1fuben32
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben25"></span>
            <div class="name">
              云端连接
            </div>
            <div class="code-name">.icon-a-huaban1fuben25
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben11"></span>
            <div class="name">
              服务器
            </div>
            <div class="code-name">.icon-a-huaban1fuben11
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben37"></span>
            <div class="name">
              分享
            </div>
            <div class="code-name">.icon-a-huaban1fuben37
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben34"></span>
            <div class="name">
              断开
            </div>
            <div class="code-name">.icon-a-huaban1fuben34
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben38"></span>
            <div class="name">
              安全
            </div>
            <div class="code-name">.icon-a-huaban1fuben38
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben23"></span>
            <div class="name">
              云端上传
            </div>
            <div class="code-name">.icon-a-huaban1fuben23
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben39"></span>
            <div class="name">
              可见
            </div>
            <div class="code-name">.icon-a-huaban1fuben39
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben30"></span>
            <div class="name">
              修剪
            </div>
            <div class="code-name">.icon-a-huaban1fuben30
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben31"></span>
            <div class="name">
              校对
            </div>
            <div class="code-name">.icon-a-huaban1fuben31
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben20"></span>
            <div class="name">
              查询记录
            </div>
            <div class="code-name">.icon-a-huaban1fuben20
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben28"></span>
            <div class="name">
              存储
            </div>
            <div class="code-name">.icon-a-huaban1fuben28
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-huaban1fuben36"></span>
            <div class="name">
              文件
            </div>
            <div class="code-name">.icon-a-huaban1fuben36
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_kebiaodaoru"></span>
            <div class="name">
              icon_课表导入
            </div>
            <div class="code-name">.icon-icon_kebiaodaoru
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_shijia"></span>
            <div class="name">
              icon_事假
            </div>
            <div class="code-name">.icon-icon_shijia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_xueqipeizhi"></span>
            <div class="name">
              icon_学期配置
            </div>
            <div class="code-name">.icon-icon_xueqipeizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon_zhuanyeguanli"></span>
            <div class="name">
              icon_专业管理
            </div>
            <div class="code-name">.icon-icon_zhuanyeguanli
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gouwuchekong"></use>
                </svg>
                <div class="name">购物车空</div>
                <div class="code-name">#icon-gouwuchekong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shouji"></use>
                </svg>
                <div class="name">手机</div>
                <div class="code-name">#icon-shouji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gouwuche"></use>
                </svg>
                <div class="name">购物车</div>
                <div class="code-name">#icon-gouwuche</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shouji1"></use>
                </svg>
                <div class="name">手机</div>
                <div class="code-name">#icon-shouji1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gouwuche1"></use>
                </svg>
                <div class="name"> 购物车</div>
                <div class="code-name">#icon-gouwuche1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-kefu"></use>
                </svg>
                <div class="name">客服</div>
                <div class="code-name">#icon-kefu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A"></use>
                </svg>
                <div class="name">百分比</div>
                <div class="code-name">#icon-icon_A</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A1"></use>
                </svg>
                <div class="name">日志</div>
                <div class="code-name">#icon-icon_A1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A2"></use>
                </svg>
                <div class="name">文章</div>
                <div class="code-name">#icon-icon_A2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A3"></use>
                </svg>
                <div class="name">抵用券</div>
                <div class="code-name">#icon-icon_A3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A4"></use>
                </svg>
                <div class="name">语言切换</div>
                <div class="code-name">#icon-icon_A4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A5"></use>
                </svg>
                <div class="name">存储</div>
                <div class="code-name">#icon-icon_A5</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A6"></use>
                </svg>
                <div class="name">查找</div>
                <div class="code-name">#icon-icon_A6</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A7"></use>
                </svg>
                <div class="name">定位</div>
                <div class="code-name">#icon-icon_A7</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A8"></use>
                </svg>
                <div class="name">消息</div>
                <div class="code-name">#icon-icon_A8</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A9"></use>
                </svg>
                <div class="name">扫描</div>
                <div class="code-name">#icon-icon_A9</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A10"></use>
                </svg>
                <div class="name">下载</div>
                <div class="code-name">#icon-icon_A10</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A11"></use>
                </svg>
                <div class="name">分享</div>
                <div class="code-name">#icon-icon_A11</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A12"></use>
                </svg>
                <div class="name">客服</div>
                <div class="code-name">#icon-icon_A12</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A13"></use>
                </svg>
                <div class="name">上传</div>
                <div class="code-name">#icon-icon_A13</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A14"></use>
                </svg>
                <div class="name">设置</div>
                <div class="code-name">#icon-icon_A14</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A15"></use>
                </svg>
                <div class="name">照相机</div>
                <div class="code-name">#icon-icon_A15</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A16"></use>
                </svg>
                <div class="name">监测</div>
                <div class="code-name">#icon-icon_A16</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A17"></use>
                </svg>
                <div class="name">打印</div>
                <div class="code-name">#icon-icon_A17</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A18"></use>
                </svg>
                <div class="name">我的</div>
                <div class="code-name">#icon-icon_A18</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A19"></use>
                </svg>
                <div class="name">对话</div>
                <div class="code-name">#icon-icon_A19</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A20"></use>
                </svg>
                <div class="name">店铺</div>
                <div class="code-name">#icon-icon_A20</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A21"></use>
                </svg>
                <div class="name">删除</div>
                <div class="code-name">#icon-icon_A21</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A22"></use>
                </svg>
                <div class="name">刷新</div>
                <div class="code-name">#icon-icon_A22</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A23"></use>
                </svg>
                <div class="name">视频</div>
                <div class="code-name">#icon-icon_A23</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A24"></use>
                </svg>
                <div class="name">我们</div>
                <div class="code-name">#icon-icon_A24</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A25"></use>
                </svg>
                <div class="name">倒计时</div>
                <div class="code-name">#icon-icon_A25</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A26"></use>
                </svg>
                <div class="name">安全</div>
                <div class="code-name">#icon-icon_A26</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_A27"></use>
                </svg>
                <div class="name">签到</div>
                <div class="code-name">#icon-icon_A27</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fanhuide"></use>
                </svg>
                <div class="name">返回的</div>
                <div class="code-name">#icon-fanhuide</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zaixianbianji"></use>
                </svg>
                <div class="name">在线编辑</div>
                <div class="code-name">#icon-zaixianbianji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yun"></use>
                </svg>
                <div class="name">云</div>
                <div class="code-name">#icon-yun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gongdan"></use>
                </svg>
                <div class="name">工单</div>
                <div class="code-name">#icon-gongdan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-youxia"></use>
                </svg>
                <div class="name">右下</div>
                <div class="code-name">#icon-youxia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zuojiantou"></use>
                </svg>
                <div class="name">左箭头</div>
                <div class="code-name">#icon-zuojiantou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-youce"></use>
                </svg>
                <div class="name">右侧</div>
                <div class="code-name">#icon-youce</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zuoce"></use>
                </svg>
                <div class="name">左侧</div>
                <div class="code-name">#icon-zuoce</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-youshang"></use>
                </svg>
                <div class="name">右上</div>
                <div class="code-name">#icon-youshang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zuoshang"></use>
                </svg>
                <div class="name">左上</div>
                <div class="code-name">#icon-zuoshang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zuo"></use>
                </svg>
                <div class="name">左</div>
                <div class="code-name">#icon-zuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-you"></use>
                </svg>
                <div class="name">右</div>
                <div class="code-name">#icon-you</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wanglaiyonghu"></use>
                </svg>
                <div class="name">往来用户</div>
                <div class="code-name">#icon-wanglaiyonghu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiangzuo"></use>
                </svg>
                <div class="name">向左</div>
                <div class="code-name">#icon-xiangzuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fenxiang"></use>
                </svg>
                <div class="name">分享</div>
                <div class="code-name">#icon-fenxiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-youjiantou"></use>
                </svg>
                <div class="name">右箭头</div>
                <div class="code-name">#icon-youjiantou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tuichu"></use>
                </svg>
                <div class="name">退出</div>
                <div class="code-name">#icon-tuichu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dianpu"></use>
                </svg>
                <div class="name">店铺</div>
                <div class="code-name">#icon-dianpu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yonghuwancheng"></use>
                </svg>
                <div class="name">用户完成</div>
                <div class="code-name">#icon-yonghuwancheng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiangyou"></use>
                </svg>
                <div class="name">向右</div>
                <div class="code-name">#icon-xiangyou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-quanbuhuifu"></use>
                </svg>
                <div class="name">全部回复</div>
                <div class="code-name">#icon-quanbuhuifu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dianzan"></use>
                </svg>
                <div class="name">点赞</div>
                <div class="code-name">#icon-dianzan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gongsi"></use>
                </svg>
                <div class="name">公司</div>
                <div class="code-name">#icon-gongsi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zuoxia"></use>
                </svg>
                <div class="name">左下</div>
                <div class="code-name">#icon-zuoxia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shalou"></use>
                </svg>
                <div class="name">沙漏</div>
                <div class="code-name">#icon-shalou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaodanbianji"></use>
                </svg>
                <div class="name">表单编辑</div>
                <div class="code-name">#icon-biaodanbianji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-daiban"></use>
                </svg>
                <div class="name">待办</div>
                <div class="code-name">#icon-daiban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-lajishanchu"></use>
                </svg>
                <div class="name">垃圾删除</div>
                <div class="code-name">#icon-lajishanchu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fuzhi"></use>
                </svg>
                <div class="name">复制</div>
                <div class="code-name">#icon-fuzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-diannao"></use>
                </svg>
                <div class="name">电脑</div>
                <div class="code-name">#icon-diannao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shouji2"></use>
                </svg>
                <div class="name">手机</div>
                <div class="code-name">#icon-shouji2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-anquandunpai"></use>
                </svg>
                <div class="name">安全盾牌</div>
                <div class="code-name">#icon-anquandunpai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yinpin"></use>
                </svg>
                <div class="name">音频</div>
                <div class="code-name">#icon-yinpin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-chakan"></use>
                </svg>
                <div class="name">查看</div>
                <div class="code-name">#icon-chakan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jinriyonghu"></use>
                </svg>
                <div class="name">今日用户</div>
                <div class="code-name">#icon-jinriyonghu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fujian"></use>
                </svg>
                <div class="name">附件</div>
                <div class="code-name">#icon-fujian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-huifu"></use>
                </svg>
                <div class="name">回复</div>
                <div class="code-name">#icon-huifu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-duankai"></use>
                </svg>
                <div class="name">断开</div>
                <div class="code-name">#icon-duankai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhiding"></use>
                </svg>
                <div class="name">置顶</div>
                <div class="code-name">#icon-zhiding</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuben"></use>
                </svg>
                <div class="name">书本</div>
                <div class="code-name">#icon-shuben</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-home-Outline"></use>
                </svg>
                <div class="name">home-Outline</div>
                <div class="code-name">#icon-home-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-home-Fill"></use>
                </svg>
                <div class="name">home-Fill</div>
                <div class="code-name">#icon-home-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-read-Outline"></use>
                </svg>
                <div class="name">read-Outline</div>
                <div class="code-name">#icon-read-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-read-Fill"></use>
                </svg>
                <div class="name">read-Fill</div>
                <div class="code-name">#icon-read-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-write-Outline"></use>
                </svg>
                <div class="name">write-Outline</div>
                <div class="code-name">#icon-write-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-write-Fill"></use>
                </svg>
                <div class="name">write-Fill</div>
                <div class="code-name">#icon-write-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tags-Outline"></use>
                </svg>
                <div class="name">tags-Outline</div>
                <div class="code-name">#icon-tags-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tags-Fill"></use>
                </svg>
                <div class="name">tags-Fill</div>
                <div class="code-name">#icon-tags-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mine-Outline"></use>
                </svg>
                <div class="name">mine-Outline</div>
                <div class="code-name">#icon-mine-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mine-Fill"></use>
                </svg>
                <div class="name">mine-Fill</div>
                <div class="code-name">#icon-mine-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Notes-Outline"></use>
                </svg>
                <div class="name">Notes-Outline</div>
                <div class="code-name">#icon-Notes-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Notes-Fill"></use>
                </svg>
                <div class="name">Notes-Fill</div>
                <div class="code-name">#icon-Notes-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Note-Outline"></use>
                </svg>
                <div class="name">Note-Outline</div>
                <div class="code-name">#icon-Note-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Note-Fill"></use>
                </svg>
                <div class="name">Note-Fill</div>
                <div class="code-name">#icon-Note-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Tag-Outline"></use>
                </svg>
                <div class="name">Tag-Outline</div>
                <div class="code-name">#icon-Tag-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Tag-Fill"></use>
                </svg>
                <div class="name">Tag-Fill</div>
                <div class="code-name">#icon-Tag-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Delate-Outline"></use>
                </svg>
                <div class="name">Delate-Outline</div>
                <div class="code-name">#icon-Delate-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Delate-Fill"></use>
                </svg>
                <div class="name">Delate-Fill</div>
                <div class="code-name">#icon-Delate-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_renyuanzuzhitongbu"></use>
                </svg>
                <div class="name">icon_人员组织同步</div>
                <div class="code-name">#icon-icon_renyuanzuzhitongbu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_shujuzhongtai"></use>
                </svg>
                <div class="name">icon_数据中台</div>
                <div class="code-name">#icon-icon_shujuzhongtai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_tonghangshijianjihua"></use>
                </svg>
                <div class="name">icon_通行时间计划</div>
                <div class="code-name">#icon-icon_tonghangshijianjihua</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_renyuantonghangzu"></use>
                </svg>
                <div class="name">icon_人员通行组</div>
                <div class="code-name">#icon-icon_renyuantonghangzu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_zaixianyuejuan"></use>
                </svg>
                <div class="name">icon_在线阅卷</div>
                <div class="code-name">#icon-icon_zaixianyuejuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xueshengcuoti"></use>
                </svg>
                <div class="name">icon_学生错题</div>
                <div class="code-name">#icon-icon_xueshengcuoti</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xueqibaogao"></use>
                </svg>
                <div class="name">icon_学期报告</div>
                <div class="code-name">#icon-icon_xueqibaogao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_wangshangzuoye"></use>
                </svg>
                <div class="name">icon_网上作业</div>
                <div class="code-name">#icon-icon_wangshangzuoye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xianxiazuoye"></use>
                </svg>
                <div class="name">icon_线下作业</div>
                <div class="code-name">#icon-icon_xianxiazuoye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_guijiditupeizhi"></use>
                </svg>
                <div class="name">icon_轨迹地图配置</div>
                <div class="code-name">#icon-icon_guijiditupeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_kaoshiguanli"></use>
                </svg>
                <div class="name">icon_考试管理</div>
                <div class="code-name">#icon-icon_kaoshiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_jiaocaiguanli"></use>
                </svg>
                <div class="name">icon_教材管理</div>
                <div class="code-name">#icon-icon_jiaocaiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_zoubanfenban"></use>
                </svg>
                <div class="name">icon_走班分班</div>
                <div class="code-name">#icon-icon_zoubanfenban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_zhishishu"></use>
                </svg>
                <div class="name">icon_知识树</div>
                <div class="code-name">#icon-icon_zhishishu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_jiaofuguanli"></use>
                </svg>
                <div class="name">icon_教辅管理</div>
                <div class="code-name">#icon-icon_jiaofuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_chengjidaoru"></use>
                </svg>
                <div class="name">icon_成绩导入</div>
                <div class="code-name">#icon-icon_chengjidaoru</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_zoubanpaike"></use>
                </svg>
                <div class="name">icon_走班排课</div>
                <div class="code-name">#icon-icon_zoubanpaike</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_jiaoxuejiankong"></use>
                </svg>
                <div class="name">icon_教学监控</div>
                <div class="code-name">#icon-icon_jiaoxuejiankong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xiaoneizujuan"></use>
                </svg>
                <div class="name">icon_校内组卷</div>
                <div class="code-name">#icon-icon_xiaoneizujuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_shangkekaoqinpeizhi"></use>
                </svg>
                <div class="name">icon_上课考勤配置</div>
                <div class="code-name">#icon-icon_shangkekaoqinpeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_kaowuguanli"></use>
                </svg>
                <div class="name">icon_考务管理</div>
                <div class="code-name">#icon-icon_kaowuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_renlianku"></use>
                </svg>
                <div class="name">icon_人脸库</div>
                <div class="code-name">#icon-icon_renlianku</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_jiaoshikeshitongji"></use>
                </svg>
                <div class="name">icon_教师课时统计</div>
                <div class="code-name">#icon-icon_jiaoshikeshitongji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_linshitiaodaike"></use>
                </svg>
                <div class="name">icon_临时调代课</div>
                <div class="code-name">#icon-icon_linshitiaodaike</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_renyuantongbuzhuangtaichaxun"></use>
                </svg>
                <div class="name">icon_人员同步状态查询</div>
                <div class="code-name">#icon-icon_renyuantongbuzhuangtaichaxun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_datikaguanli"></use>
                </svg>
                <div class="name">icon_答题卡管理</div>
                <div class="code-name">#icon-icon_datikaguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_keshipeizhi"></use>
                </svg>
                <div class="name">icon_课时配置</div>
                <div class="code-name">#icon-icon_keshipeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_keyedianpingdaochu"></use>
                </svg>
                <div class="name">icon_课业点评导出</div>
                <div class="code-name">#icon-icon_keyedianpingdaochu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xingaokaoxuanke"></use>
                </svg>
                <div class="name">icon_新高考选科</div>
                <div class="code-name">#icon-icon_xingaokaoxuanke</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_kemuguanli"></use>
                </svg>
                <div class="name">icon_科目管理</div>
                <div class="code-name">#icon-icon_kemuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xiaoneitongzhi"></use>
                </svg>
                <div class="name">icon_校内通知</div>
                <div class="code-name">#icon-icon_xiaoneitongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_chengjipeizhi"></use>
                </svg>
                <div class="name">icon_成绩配置</div>
                <div class="code-name">#icon-icon_chengjipeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_jiaoxuefanweipeizhi"></use>
                </svg>
                <div class="name">icon_教学范围配置</div>
                <div class="code-name">#icon-icon_jiaoxuefanweipeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_yiwushiguanli"></use>
                </svg>
                <div class="name">icon_医务室管理</div>
                <div class="code-name">#icon-icon_yiwushiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_kechengguanli"></use>
                </svg>
                <div class="name">icon_课程管理</div>
                <div class="code-name">#icon-icon_kechengguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_jiaoshiqingjiajilu"></use>
                </svg>
                <div class="name">icon_教师请假记录</div>
                <div class="code-name">#icon-icon_jiaoshiqingjiajilu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xiaobentiku"></use>
                </svg>
                <div class="name">icon_校本题库</div>
                <div class="code-name">#icon-icon_xiaobentiku</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_pingyutianxie"></use>
                </svg>
                <div class="name">icon_评语填写</div>
                <div class="code-name">#icon-icon_pingyutianxie</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_deyupeizhi"></use>
                </svg>
                <div class="name">icon_德育配置</div>
                <div class="code-name">#icon-icon_deyupeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xuanxiukexuanke"></use>
                </svg>
                <div class="name">icon_选修课选课</div>
                <div class="code-name">#icon-icon_xuanxiukexuanke</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_jiaoxuebanguanli"></use>
                </svg>
                <div class="name">icon_教学班管理</div>
                <div class="code-name">#icon-icon_jiaoxuebanguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xueshengchurukaoqinpeizhi"></use>
                </svg>
                <div class="name">icon_学生出入考勤配置</div>
                <div class="code-name">#icon-icon_xueshengchurukaoqinpeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_yichangrenyuanguanli"></use>
                </svg>
                <div class="name">icon_异常人员管理</div>
                <div class="code-name">#icon-icon_yichangrenyuanguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_pingyuguanli"></use>
                </svg>
                <div class="name">icon_评语管理</div>
                <div class="code-name">#icon-icon_pingyuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_cewenguizepeizhi"></use>
                </svg>
                <div class="name">icon_测温规则配置</div>
                <div class="code-name">#icon-icon_cewenguizepeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xueshengjiankangdangan"></use>
                </svg>
                <div class="name">icon_学生健康档案</div>
                <div class="code-name">#icon-icon_xueshengjiankangdangan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_wanzixizuoweiguanli"></use>
                </svg>
                <div class="name">icon_晚自习座位管理</div>
                <div class="code-name">#icon-icon_wanzixizuoweiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_renyuantonghangguankong"></use>
                </svg>
                <div class="name">icon_人员通行管控</div>
                <div class="code-name">#icon-icon_renyuantonghangguankong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_gaojingzhongxin"></use>
                </svg>
                <div class="name">icon_告警中心</div>
                <div class="code-name">#icon-icon_gaojingzhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_cewenjilu"></use>
                </svg>
                <div class="name">icon_测温记录</div>
                <div class="code-name">#icon-icon_cewenjilu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_tiaodaikejilu"></use>
                </svg>
                <div class="name">icon_调代课记录</div>
                <div class="code-name">#icon-icon_tiaodaikejilu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_banjifengcai"></use>
                </svg>
                <div class="name">icon_班级风采</div>
                <div class="code-name">#icon-icon_banjifengcai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_renyuantonghangjilu"></use>
                </svg>
                <div class="name">icon_人员通行记录</div>
                <div class="code-name">#icon-icon_renyuantonghangjilu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_banpaiguankong"></use>
                </svg>
                <div class="name">icon_班牌管控</div>
                <div class="code-name">#icon-icon_banpaiguankong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_jiaozhigongxungeng"></use>
                </svg>
                <div class="name">icon_教职工巡更</div>
                <div class="code-name">#icon-icon_jiaozhigongxungeng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_gongwenshoufa"></use>
                </svg>
                <div class="name">icon_公文收发</div>
                <div class="code-name">#icon-icon_gongwenshoufa</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_shenpiliuchengpeizhi"></use>
                </svg>
                <div class="name">icon_审批流程配置</div>
                <div class="code-name">#icon-icon_shenpiliuchengpeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_wenyinshenqing"></use>
                </svg>
                <div class="name">icon_文印申请</div>
                <div class="code-name">#icon-icon_wenyinshenqing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_shebeiguanli"></use>
                </svg>
                <div class="name">icon_设备管理</div>
                <div class="code-name">#icon-icon_shebeiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_bumenguanli"></use>
                </svg>
                <div class="name">icon_部门管理</div>
                <div class="code-name">#icon-icon_bumenguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_gongwenku"></use>
                </svg>
                <div class="name">icon_公文库</div>
                <div class="code-name">#icon-icon_gongwenku</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_changdiguanli"></use>
                </svg>
                <div class="name">icon_场地管理</div>
                <div class="code-name">#icon-icon_changdiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_banpaiqiandaoshijian"></use>
                </svg>
                <div class="name">icon_班牌签到事件</div>
                <div class="code-name">#icon-icon_banpaiqiandaoshijian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_jiaozhigongguanli"></use>
                </svg>
                <div class="name">icon_教职工管理</div>
                <div class="code-name">#icon-icon_jiaozhigongguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xueshengqingjiajilu"></use>
                </svg>
                <div class="name">icon_学生请假记录</div>
                <div class="code-name">#icon-icon_xueshengqingjiajilu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xinwengonggao"></use>
                </svg>
                <div class="name">icon_新闻公告</div>
                <div class="code-name">#icon-icon_xinwengonggao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_tongxiaoshengguanli"></use>
                </svg>
                <div class="name">icon_通校生管理</div>
                <div class="code-name">#icon-icon_tongxiaoshengguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_sushekashenqingguanli"></use>
                </svg>
                <div class="name">icon_宿舍卡申请管理</div>
                <div class="code-name">#icon-icon_sushekashenqingguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_shenpijilu"></use>
                </svg>
                <div class="name">icon_审批记录</div>
                <div class="code-name">#icon-icon_shenpijilu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xueshengfenzupeizhi"></use>
                </svg>
                <div class="name">icon_学生分组配置</div>
                <div class="code-name">#icon-icon_xueshengfenzupeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_shouwenmobanguanli"></use>
                </svg>
                <div class="name">icon_收文模版管理</div>
                <div class="code-name">#icon-icon_shouwenmobanguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_wenyinshiguanli"></use>
                </svg>
                <div class="name">icon_文印室管理</div>
                <div class="code-name">#icon-icon_wenyinshiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_qinshiguanli"></use>
                </svg>
                <div class="name">icon_寝室管理</div>
                <div class="code-name">#icon-icon_qinshiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_chakankebiao"></use>
                </svg>
                <div class="name">icon_查看课表</div>
                <div class="code-name">#icon-icon_chakankebiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xueyebaogao"></use>
                </svg>
                <div class="name">icon_学业报告</div>
                <div class="code-name">#icon-icon_xueyebaogao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xueshengguanli"></use>
                </svg>
                <div class="name">icon_学生管理</div>
                <div class="code-name">#icon-icon_xueshengguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Subscribe-Outline"></use>
                </svg>
                <div class="name">Subscribe-Outline</div>
                <div class="code-name">#icon-Subscribe-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Subscribe-Fill"></use>
                </svg>
                <div class="name">Subscribe-Fill</div>
                <div class="code-name">#icon-Subscribe-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-System-Outline"></use>
                </svg>
                <div class="name">System-Outline</div>
                <div class="code-name">#icon-System-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-System-Fill"></use>
                </svg>
                <div class="name">System-Fill</div>
                <div class="code-name">#icon-System-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Collect-Outline"></use>
                </svg>
                <div class="name">Collect-Outline</div>
                <div class="code-name">#icon-Collect-Outline</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Collect-Fill"></use>
                </svg>
                <div class="name">Collect-Fill</div>
                <div class="code-name">#icon-Collect-Fill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Arrow-Big"></use>
                </svg>
                <div class="name">Arrow-Big</div>
                <div class="code-name">#icon-Arrow-Big</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Arrow-Double"></use>
                </svg>
                <div class="name">Arrow-Double</div>
                <div class="code-name">#icon-Arrow-Double</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Arrow-Small"></use>
                </svg>
                <div class="name">Arrow-Small</div>
                <div class="code-name">#icon-Arrow-Small</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Arrow-Square"></use>
                </svg>
                <div class="name">Arrow-Square</div>
                <div class="code-name">#icon-Arrow-Square</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Search"></use>
                </svg>
                <div class="name">Search</div>
                <div class="code-name">#icon-Search</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Notice"></use>
                </svg>
                <div class="name">Notice</div>
                <div class="code-name">#icon-Notice</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Upload"></use>
                </svg>
                <div class="name">Upload</div>
                <div class="code-name">#icon-Upload</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Download"></use>
                </svg>
                <div class="name">Download</div>
                <div class="code-name">#icon-Download</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Special"></use>
                </svg>
                <div class="name">Special</div>
                <div class="code-name">#icon-Special</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Article"></use>
                </svg>
                <div class="name">Article</div>
                <div class="code-name">#icon-Article</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Mind"></use>
                </svg>
                <div class="name">Mind</div>
                <div class="code-name">#icon-Mind</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Kaiti"></use>
                </svg>
                <div class="name">Kaiti</div>
                <div class="code-name">#icon-Kaiti</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Contribution"></use>
                </svg>
                <div class="name">Contribution</div>
                <div class="code-name">#icon-Contribution</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Achievements"></use>
                </svg>
                <div class="name">Achievements</div>
                <div class="code-name">#icon-Achievements</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Menber"></use>
                </svg>
                <div class="name">Menber</div>
                <div class="code-name">#icon-Menber</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Package"></use>
                </svg>
                <div class="name">Package</div>
                <div class="code-name">#icon-Package</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-Signout"></use>
                </svg>
                <div class="name">Sign out</div>
                <div class="code-name">#icon-a-Signout</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-Setup"></use>
                </svg>
                <div class="name">Set up</div>
                <div class="code-name">#icon-a-Setup</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Team"></use>
                </svg>
                <div class="name">Team</div>
                <div class="code-name">#icon-Team</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-More"></use>
                </svg>
                <div class="name">More</div>
                <div class="code-name">#icon-More</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben43"></use>
                </svg>
                <div class="name">图片</div>
                <div class="code-name">#icon-a-huaban1fuben43</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben46"></use>
                </svg>
                <div class="name">排序</div>
                <div class="code-name">#icon-a-huaban1fuben46</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben47"></use>
                </svg>
                <div class="name">消息</div>
                <div class="code-name">#icon-a-huaban1fuben47</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben48"></use>
                </svg>
                <div class="name">筛选</div>
                <div class="code-name">#icon-a-huaban1fuben48</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben45"></use>
                </svg>
                <div class="name">前进</div>
                <div class="code-name">#icon-a-huaban1fuben45</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben40"></use>
                </svg>
                <div class="name">不可见</div>
                <div class="code-name">#icon-a-huaban1fuben40</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianjia"></use>
                </svg>
                <div class="name">添加</div>
                <div class="code-name">#icon-tianjia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben"></use>
                </svg>
                <div class="name">同步时间</div>
                <div class="code-name">#icon-a-huaban1fuben</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben42"></use>
                </svg>
                <div class="name">设置</div>
                <div class="code-name">#icon-a-huaban1fuben42</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben41"></use>
                </svg>
                <div class="name">帮助</div>
                <div class="code-name">#icon-a-huaban1fuben41</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1"></use>
                </svg>
                <div class="name">刷新</div>
                <div class="code-name">#icon-a-huaban1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben4"></use>
                </svg>
                <div class="name">删除</div>
                <div class="code-name">#icon-a-huaban1fuben4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben7"></use>
                </svg>
                <div class="name">密码</div>
                <div class="code-name">#icon-a-huaban1fuben7</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben3"></use>
                </svg>
                <div class="name">编辑</div>
                <div class="code-name">#icon-a-huaban1fuben3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben44"></use>
                </svg>
                <div class="name">返回</div>
                <div class="code-name">#icon-a-huaban1fuben44</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben6"></use>
                </svg>
                <div class="name">用户</div>
                <div class="code-name">#icon-a-huaban1fuben6</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben5"></use>
                </svg>
                <div class="name">日历</div>
                <div class="code-name">#icon-a-huaban1fuben5</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben17"></use>
                </svg>
                <div class="name">告警</div>
                <div class="code-name">#icon-a-huaban1fuben17</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben9"></use>
                </svg>
                <div class="name">开发</div>
                <div class="code-name">#icon-a-huaban1fuben9</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben21"></use>
                </svg>
                <div class="name">日志</div>
                <div class="code-name">#icon-a-huaban1fuben21</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben18"></use>
                </svg>
                <div class="name">关闭</div>
                <div class="code-name">#icon-a-huaban1fuben18</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben19"></use>
                </svg>
                <div class="name">搜索</div>
                <div class="code-name">#icon-a-huaban1fuben19</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben13"></use>
                </svg>
                <div class="name">网络设备</div>
                <div class="code-name">#icon-a-huaban1fuben13</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben29"></use>
                </svg>
                <div class="name">导入</div>
                <div class="code-name">#icon-a-huaban1fuben29</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben15"></use>
                </svg>
                <div class="name">cpu</div>
                <div class="code-name">#icon-a-huaban1fuben15</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben10"></use>
                </svg>
                <div class="name">客户端</div>
                <div class="code-name">#icon-a-huaban1fuben10</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben14"></use>
                </svg>
                <div class="name">控制器</div>
                <div class="code-name">#icon-a-huaban1fuben14</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben16"></use>
                </svg>
                <div class="name">网络专线</div>
                <div class="code-name">#icon-a-huaban1fuben16</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben26"></use>
                </svg>
                <div class="name">虚拟机</div>
                <div class="code-name">#icon-a-huaban1fuben26</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben12"></use>
                </svg>
                <div class="name">内存卡</div>
                <div class="code-name">#icon-a-huaban1fuben12</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben33"></use>
                </svg>
                <div class="name">导出</div>
                <div class="code-name">#icon-a-huaban1fuben33</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben27"></use>
                </svg>
                <div class="name">企业</div>
                <div class="code-name">#icon-a-huaban1fuben27</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben24"></use>
                </svg>
                <div class="name">云端下载</div>
                <div class="code-name">#icon-a-huaban1fuben24</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben22"></use>
                </svg>
                <div class="name">管理</div>
                <div class="code-name">#icon-a-huaban1fuben22</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben8"></use>
                </svg>
                <div class="name">关联</div>
                <div class="code-name">#icon-a-huaban1fuben8</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben35"></use>
                </svg>
                <div class="name">应用</div>
                <div class="code-name">#icon-a-huaban1fuben35</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben32"></use>
                </svg>
                <div class="name">扩展</div>
                <div class="code-name">#icon-a-huaban1fuben32</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben25"></use>
                </svg>
                <div class="name">云端连接</div>
                <div class="code-name">#icon-a-huaban1fuben25</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben11"></use>
                </svg>
                <div class="name">服务器</div>
                <div class="code-name">#icon-a-huaban1fuben11</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben37"></use>
                </svg>
                <div class="name">分享</div>
                <div class="code-name">#icon-a-huaban1fuben37</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben34"></use>
                </svg>
                <div class="name">断开</div>
                <div class="code-name">#icon-a-huaban1fuben34</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben38"></use>
                </svg>
                <div class="name">安全</div>
                <div class="code-name">#icon-a-huaban1fuben38</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben23"></use>
                </svg>
                <div class="name">云端上传</div>
                <div class="code-name">#icon-a-huaban1fuben23</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben39"></use>
                </svg>
                <div class="name">可见</div>
                <div class="code-name">#icon-a-huaban1fuben39</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben30"></use>
                </svg>
                <div class="name">修剪</div>
                <div class="code-name">#icon-a-huaban1fuben30</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben31"></use>
                </svg>
                <div class="name">校对</div>
                <div class="code-name">#icon-a-huaban1fuben31</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben20"></use>
                </svg>
                <div class="name">查询记录</div>
                <div class="code-name">#icon-a-huaban1fuben20</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben28"></use>
                </svg>
                <div class="name">存储</div>
                <div class="code-name">#icon-a-huaban1fuben28</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-huaban1fuben36"></use>
                </svg>
                <div class="name">文件</div>
                <div class="code-name">#icon-a-huaban1fuben36</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_kebiaodaoru"></use>
                </svg>
                <div class="name">icon_课表导入</div>
                <div class="code-name">#icon-icon_kebiaodaoru</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_shijia"></use>
                </svg>
                <div class="name">icon_事假</div>
                <div class="code-name">#icon-icon_shijia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_xueqipeizhi"></use>
                </svg>
                <div class="name">icon_学期配置</div>
                <div class="code-name">#icon-icon_xueqipeizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon_zhuanyeguanli"></use>
                </svg>
                <div class="name">icon_专业管理</div>
                <div class="code-name">#icon-icon_zhuanyeguanli</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
